<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 使用对象或map实现把扁平数组转成树型数组的函数
        function transListToTreeData(list, rootValue) {
            // 1. 得到一个对象： {pid值: [子数据1, 子数据2]}
            // {
            //     0: [{ id: 1, name: '总裁办', pid: 0 }, { id: 2, name: 'IT部', pid: 0 }],
            //     1: [{ id: 11, name: '秘书处', pid: 1 }]
            // }
            console.log(list,rootValue);
            const map = {}
            list.forEach(item => {
                if (map[item.pid]) {
                    map[item.pid].push(item)
                } else {
                    map[item.pid] = [item]
                }
            })


            // 2. 对原数组进行修改, 有孩子就加children属性，没有孩子就不用加
            //    遍历处理数组中的每一个元素
            //    去上面的对象中找当前遍历到的元素的id属性值对应的属性，作为当前元素的children属性
            // [
            //     { id: 1, name: '总裁办', pid: 0, children: [{ id: 11, name: '秘书处', pid: 1 }] },
            //     { id: 11, name: '秘书处', pid: 1 },
            //     { id: 2, name: 'IT部', pid: 0 }
            // ]

            list.forEach(item => {
                const children = map[item.id]
                if (children) {
                    item.children = children
                }
            })
            console.log(list);
            // 3. 对原数组进行过滤，保留pid===rootValue的元素，返回
            // [
            //     { id: 1, name: '总裁办', pid: 0, children: [{ id: 11, name: '秘书处', pid: 1 }] },
            //     { id: 2, name: 'IT部', pid: 0 }
            // ]
            return list.filter(item => item.pid === rootValue)
        }

        // 测试代码：
        var arr = [
            { id: 1, name: '总裁办', pid: 0 },
            { id: 11, name: '秘书处', pid: 1 },
            { id: 2, name: 'IT部', pid: 0 }
        ]

        let result = transListToTreeData(arr, 0)
        console.log('arr', arr);
        console.log(result);
    </script>
</body>

</html>